import type { ConfigEnv, UserConfigExport } from "vite";
import { fileURLToPath, URL } from "node:url";
import tailwindcss from "@tailwindcss/vite";
import vue from "@vitejs/plugin-vue";
import vueJsx from "@vitejs/plugin-vue-jsx";
import { visualizer } from "rollup-plugin-visualizer";
import Icons from "unplugin-icons/vite";
import { defineConfig, loadEnv } from "vite";
import { compression, defineAlgorithm } from "vite-plugin-compression2";
import vueDevTools from "vite-plugin-vue-devtools";
import svgLoader from "vite-svg-loader";
import { viteBuildInfo } from "./build/info";

// https://vite.dev/config/
export default ({ mode }: ConfigEnv): UserConfigExport => {
    /*
        process.cwd() 获取的是整个应用程序的当前工作目录,
        而 __dirname 是相对于当前文件的目录
    */
    const { VITE_PORT } = loadEnv(mode, process.cwd());
    return defineConfig({
        server: {
            port: Number(VITE_PORT), // 平台本地运行端口号
            // Note[vite] 这里本地服务启用反向代理解决开发环境跨域问题, 注意: 1.axios 配置了基础路径 `/api`, 2.部署后仍需要根据下面配置来更新 nginx 反向代理
            proxy: {
                // 代理天地图 API
                "/api/tianditu": {
                    target: "http://api.tianditu.gov.cn", // 天地图 API 地址
                    changeOrigin: true, // 修改请求头中的 Origin
                    rewrite: path => path.replace(/^\/api\/tianditu/, ""), // 移除代理前缀
                },
                // 代理后端服务 API
                "/api": {
                    target: loadEnv(mode, process.cwd()).VITE_API_BASE_URL, // 后端服务地址
                    changeOrigin: true, // 修改请求头中的 Origin
                    rewrite: path => path.replace(/^\/api/, ""), // 移除代理前缀
                },
            },
        },
        esbuild: {
            // 生产环境移除console和debugger，略微加长打包时间
            drop: mode === "production" ? ["console", "debugger"] : [],
        },
        plugins: [
            vue(),
            // 自动按需加载图标
            Icons({
                compiler: "vue3",
                scale: 1,
            }),
            vueDevTools(), // 开发环境启用 Vue DevTools
            viteBuildInfo(), // 打包信息插件
            vueJsx(), // jsx、tsx语法支持
            svgLoader(), // 支持svg图标组件化
            visualizer(), // 打包分析: https://www.npmjs.com/package/rollup-plugin-visualizer
            tailwindcss(),
            /*
                打包新增gzip格式: https://www.npmjs.com/package/vite-plugin-compression2
                可以配置多个压缩算法生成不同的格式的压缩文件，但会较大影响打包时间
                这里只启用 gzip 压缩基本不影响打包时间
            */
            compression({
                algorithms: [
                    defineAlgorithm("gzip", { level: 9 }),
                ],
            }),
        ],
        resolve: {
            alias: {
                "@": fileURLToPath(new URL("./src", import.meta.url)),
            },
        },
    });
};
